<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>应用详情</title>

    <link href="__CSS__/base.css" rel="stylesheet">
    <link rel="stylesheet" href="__PUBLIC__/custom/uimaker/easyui.css">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/custom/uimaker/icon.css">
    <link rel="stylesheet" href="__CSS__/providers.css">
    <link rel="stylesheet" href="__CSS__/detial.css">
</head>
<body>
<div class="container" style="padding:10px 30px;">
    <a href="javascript:" onclick="self.location=document.referrer;" class="easyui-linkbutton" iconCls="icon-back">返回</a>
</div>
<div class="contractinfo-table">
    <div id="myModal" class="modal close">
        <img class="modal-content" id="imgInfo">
        <div id="caption"></div>
    </div>

    <div class="summary">
        <form id="addpic" method="post" novalidate="novalidate" enctype="multipart/form-data" style='margin-top: 30px;'>
            <input type="hidden" id="action" name="action">
            <div class="binfo">
                <ul>
                <li style="border-right: 1px solid #5bbc9a">
                    <input type="hidden" value="<{$data.appid}>" name='appid'></input>
                    <div><label>应用名称:</label><input value="<{$data.app}>" type='text' name='app' class='easyui-textbox minp' data-options="required:true" style="height:28px" /></div>
                    <div><label>说明:</label><input value="<{$data.description}>" type='text' name='description' data-options="required:true" class="minp easyui-textbox" style="height:28px"/></div>
                </li>
                    <li>
                        <div><label>排序:</label><input class="easyui-numberspinner minp" value="<{$data.orderid}>" name="orderid" data-options="increment:1,required:true" style="height:30px;"></div>
                        <div><label>下载:</label><input  class='minp' value="<{$data.download}>" type='text' name='download' data-options="required:true" class="easyui-textbox" /></div>
                    </li>
                    <div style="clear: both;"></div>
                </ul>
            </div>
            <hr/>
            <div class="binfo">
                <ul>
                    <li style="border-right: 1px solid #5bbc9a">
                        <div><label>android包名称:</label><input  class='minp' value="<{$data.android_package}>" type='text' name='android_package' data-options="required:true" class="easyui-textbox" /></div>
                        <div><label>android包下载地址:</label><input  class='minp' value="<{$data.android_download}>" type='text' name='android_download' data-options="required:true" class="easyui-textbox" /></div>
                        <div><label>android包大小:</label><input  class='minp' value="<{$data.android_appsize}>" type='text' name='android_appsize' data-options="required:true" class="easyui-textbox" /></div>
                        <div><label>android包版本:</label><input  class='minp' value="<{$data.android_version}>" type='text' name='android_version' data-options="required:true" class="easyui-textbox" /></div>
                    </li>
                    <li>
                        <div><label>ios包名称:</label><input  class='minp' value="<{$data.ios_package}>" type='text' name='ios_package' data-options="required:true" class="easyui-textbox" /></div>
                        <div><label>ios包下载地址:</label><input  class='minp' value="<{$data.ios_download}>" type='text' name='ios_download' data-options="required:true" class="easyui-textbox" /></div>
                        <div><label>ios包大小:</label><input  class='minp' value="<{$data.ios_appsize}>" type='text' name='ios_appsize' data-options="required:true" class="easyui-textbox" /></div>
                        <div><label>ios包版本:</label><input  class='minp' value="<{$data.ios_version}>" type='text' name='ios_version' data-options="required:true" class="easyui-textbox" /></div>
                    </li>
                    <div style="clear: both;"></div>
                </ul>
            </div>
            <hr/>
            <div class="binfo">
                <ul>
                    <notempty name="data.appid">
                    <li style="border-right: 1px solid #5bbc9a">
                        <div><label>应用ID:</label><span><{$data.appid}></span></div>
                        <div><label>操作人:</label><span><{$data.admin}></span></div>
                        <div><label>创建时间:</label><span><{$data.createtime}></span></div>
                        <div><label>修改时间:</label><span><{$data.updatetime}></span></div>
                        <div><label>ID:</label><span><{$data.id}></span></div>
                    </li>
                    </notempty>
                    <li>
                        <div class="pic onel">
                            <label>图标:</label>
                            <input value="<{$data.icon}>" type='hidden' name='icon'>
                            <notempty name="data.icon">
                            <a href="javascript:void(0)" onclick = "imdBig()"> <img class='myImg' style="height: 100px;" src ='<{:C("WEBHOME")}><{$data.icon}>'></a>
                            </notempty>
                            <div style="clear: both;"></div>
                        </div>
                        <div>
                            <label>上传图片:</label>
                            <input id="fb4" class="easyui-filebox" name="icon[]" style="width:150px" data-options="label:'图片上传',prompt:'选择图片',onChange:function(){lookImg(4)}" >
                            <div style="margin:24px"id="addImage4"></div>
                        </div>
                    </li>
                    <div style="clear: both;"></div>
                </ul>
            </div>
        </form>
        <hr/>
        <div id="dlg-buttons">
             <a style="margin: 10px 50px;" href="javascript:void(0)" class="easyui-linkbutton" id="btnAddOK" iconcls="icon-ok" onclick="btnAddOK()">保存</a>
        </div>
    </div>
</div>
<script type="text/javascript" src="__PUBLIC__/custom/jquery.min.js"></script>
<script type="text/javascript" src="__PUBLIC__/custom/jquery.easyui.min.js"></script>
<script type="text/javascript" src="__PUBLIC__/custom/easyui-lang-zh_CN.js"></script>
<script>

    $("input").blur(function(){
        $(this).css("border","#aaa solid 1px");
    });

    $("input").focus(function(){
        $(this).css("border","#1da02b  solid 1.5px");
    });

    function btnAddOK() {
        $('#addpic').form('submit',{
            url: '<{:U("App/editImg")}>',
            onSubmit: function(){
                return $(this).form('validate');
            },
            success: function(result){
                if(result>0){
                    if(result==1){
                        $.messager.alert('提示','修改成功!','info',function(){
                            reload();
                        });
                    }else{
                        $.messager.confirm('提示', '添加成功，继续添加?', function(r){
                            if (r){
                                reload();
                            }else{
                                window.location.href='<{:U("App/index")}>';
                            }
                        });
                    }
                }else{
                    $.messager.show({
                        title: '错误提示',
                        msg: '操作失败'
                    });
                }
            }
        });
    }

    $('.del').click(function(){
        $(this).parent().remove();
    })

    // 上传图片预览
    function lookImg(x){
        var dd = 'aaa'+x;
        var dd = $("#fb"+x).next().find('input[type=file]')[0];
        if (dd.files && dd.files[0]){
            // 更换图片时清空原图片展示内容
            $('#addImage'+x).html('');
            for(var i=0;i<dd.files.length;i++){
                var reader = new FileReader(dd.files[i]);
                reader.onload = function(e){
                    //append为在元素中的末尾添加内容
                    $('#addImage'+x).append("<img class='addimg' src='"+e.target.result+"'height='50px;'/>");
                }
                reader.readAsDataURL(dd.files[i]);
            }
        }
    }

    function reload(){
        window.location.reload();
    }

    /**
     * 点击设置图片放大
     */
    function imdBig() {

        var modal = document.getElementById('myModal');
        var modalImg = document.getElementById("imgInfo");
        var captionText = document.getElementById("caption");
        $(".myImg").on("click",function(){
            modal.style.display = "block";
            modalImg.src = this.src;
            modalImg.alt = this.alt;
            captionText.innerHTML = this.alt;
        });
        var span = document.getElementsByClassName("close")[0];
        span.onclick = function() {
            modal.style.display = "none";
        }
    }

</script>
</body>
</html>
